<template>
	<div class="toast" v-show="iSshow">
		<div>{{message}}</div>
	</div>
</template>

<script>
	export default{
		name:'Toast',
			// props: {
			// 	message: {
			// 		type:String,
			// 		default:''
			// 	},
			// 	iSshow: {
			// 		type:Boolean,
			// 		default:false
			// 	}
			// },
			data(){
					return {
						message:'aaaaaaa',
						iSshow:false
					}
			},
			methods: {
				show(message="默认文字", duration =2000) {
					
					this.iSshow =true;
					this.message = message;
					
					setTimeout(() => {
						this.iSshow = false;
						this.message = '';
					},duration)
				}
			}
	}
</script>

<style scoped>
	.toast{
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		background-color: rgba(0,0,0,.8);
		color: #fff;
		padding: 10px 10px;
		z-index: 10;
	}
</style>
